<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>客户登录</title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css">
    <style>
        /* 新增的背景样式 - 开始 */
        body::before {
            content: "";
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background-image: url("{{ url_for('static', filename='images/896c70e19c1e016f70673ca52051715.jpg') }}");
            background-size: cover;
            background-position: center;
            z-index: -1;
        }

        .container {
            background-color: rgba(255, 255, 255, 0.85);
            border-radius: 15px;
            padding: 30px;
            margin-top: 50px;
            box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
        }
        /* 新增的背景样式 - 结束 */

        .entry-card {
            transition: transform 0.2s;

        }
        .entry-card:hover {
            transform: translateY(-5px);
        }
    </style>
</head>
<body class="bg-light">
    <div class="container-sm mt-5">
        <div class="row justify-content-center">
            <div class="col-md-6">
                <div class="card entry-card mb-4 shadow-sm">
                    <div class="card shadow">
                        <div class="card-body">
                            <h2 class="card-title text-center mb-4">客户登录</h2>
                            {% with messages = get_flashed_messages() %}
                                {% if messages %}
                                    {% for message in messages %}
                                        <div class="alert alert-danger">{{ message }}</div>
                                    {% endfor %}
                                {% endif %}
                            {% endwith %}
                            <form method="POST">
                                <div class="mb-3">
                                    <label for="cardID" class="form-label">银行卡号</label>
                                    <input type="text" class="form-control" id="cardID" name="cardID" required>
                                </div>
                                <div class="mb-3">
                                    <label for="password" class="form-label">密码</label>
                                    <input type="password" class="form-control" id="password" name="password" required>
                                </div>
                                <div class="d-grid gap-2">
                                    <button type="submit" class="btn btn-primary">登录</button>
                                    <a href="{{ url_for('index') }}" class="btn btn-outline-secondary">返回首页</a>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>
</html>